<template>
    <div>
        <el-row :gutter="20" >
            <!--用v-for循环出信息-->
            <el-col :span="12" v-for="index in actrecord" :key="index.actionRecordId" style="margin-top: 10px">
                <div class="grid-content bg-purple">
                    <div>
                        <!--名片-->
                        <el-row>
                            <!--员工名字和职位-->
                            <el-col :span="3">
                                <div class="col_font" style="height: 220px;">
                                    <span>{{index.emp.empName}}</span>
                                </div>
                            </el-col>
                            <!--右边的详细-->
                            <el-col :span="21">
                                <div style="position: relative">
                                    <!--行动对应的客户名及操作-->
                                    <el-row type="flex" class="row-bg right_detail">
                                        <!--客户名-->
                                        <el-col :span="22">
                                            <div class="col_font">
                                                {{index.customer.customerName}}   {{index.contact.contactName}}
                                            </div>
                                        </el-col>
                                        <el-col :span="2">
                                            <div class="col_font">
                                                <el-dropdown>
                                                <span class="el-dropdown-link">
                                                    <i class="iconfont icon-m-weixinwenzhang"></i>
                                                </span>
                                                    <el-dropdown-menu slot="dropdown">
                                                        <div @click="editAction(index)"><el-dropdown-item>编辑</el-dropdown-item></div>
                                                        <div @click="deleteAction(index)"><el-dropdown-item>删除</el-dropdown-item></div>
                                                    </el-dropdown-menu>
                                                </el-dropdown>
                                            </div>
                                        </el-col>
                                    </el-row>
                                </div>
                                <div class="col_detail" style="">
                                    <div class="col_detail_con">
                                        <span v-for="item in index.behaviorRecordList" :key="item.behaviorRecordId">
                                            {{item.behavior.behaviorName}}
                                        </span>,{{index.remarks}}
                                    </div>
                                    <div class="col_detail_time">
                                        {{index.actionDate | formatDate}}
                                    </div>
                                    <div class="col_detail_set">
                                        <el-button type="success" @click="give_like(index.actionRecordId)">赞 <span v-if="index.zan != 0 && index.zan != null">+{{index.zan}}</span></el-button>
                                        <el-button type="success" @click="openflow(index.contact.customer.customerId)">查看记录</el-button>
                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                    </div>
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<script>
    import {formatTimeToStr} from '@/assets/format.js'
    export default {
        name: "actrecordTable",
        props:["actrecord","acttype","type"],
        data() {
            return {
                actDelByCus:[],
            }
        },
        methods:{
        //    点赞事件
            give_like(actionRecordId){
                let empId = this.$store.state.user.empId;
                this.axios.get("api/actrecord/giveLike",{params:{"empId":empId,"actionRecordId":actionRecordId}})
                    .then(res=>{
                        window.console.log(res)
                        this.$parent.$parent.$parent.get_actRecord(this.$parent.$parent.$parent.currPage,this.$parent.$parent.$parent.state,this.$parent.$parent.$parent.search)
                }).catch(() => {
                    this.global.mes_error("点赞失败！")
                })
            },
            openflow(obj){
                    this.$parent.$parent.$parent.action = obj;
                    this.$parent.$parent.$parent.seeDetailRecordDialogVisible = true;
                    window.console.log(obj)
            },
            editAction(index){
                this.$parent.$parent.$parent.addRecordDialogVisible = true
                this.$nextTick(function(){
                    if (index.isContact === 0){
                        this.$parent.$parent.$parent.$refs.refSaveAction.isdisabled = true;
                    }
                    index.behaviorRecordList.forEach(beh => {
                        if(beh.behavior){
                            this.$parent.$parent.$parent.$refs.refSaveAction.behaRecordList.push(beh.behavior);
                            if(index.nextContactTime){
                                this.$parent.$parent.$parent.$refs.refSaveAction.nextContacDate = index.nextContactTime.substring(0,10);
                                this.$parent.$parent.$parent.$refs.refSaveAction.nextContacHour = index.nextContactTime.substring(11,19);
                                window.console.log(this.$parent.$parent.$parent.$refs.refSaveAction.nextContacDate)
                            }
                        }
                    });
                    index.behaviorRecordList = [];
                    this.$parent.$parent.$parent.$refs.refSaveAction.moveBehavior = index;
                })
            },
            deleteAction(index){
                this.global.confirm("提示","是否删除？",
                    () => {
                        this.axios.get("api/actrecord/deleteAction",{params:{"actionRecordId":index.actionRecordId}})
                            .then(v=>{
                                this.$parent.$parent.$parent.get_actiontype()
                            }).catch()
                    },() => {
                        this.global.mes_message("取消")
                    })
            },
        },
        filters: {
            formatDate: function(time) {
                if(time!=null&&time!="")
                {
                    var date = new Date(time);
                    return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
                }else{
                    return "";
                }
            }
        }
    }
</script>

<style scoped>
    .el-row {
        margin-bottom: 20px;
    &:last-child {
         margin-bottom: 0;
     }
    }
    .grid-content {
        border:1px solid rgb(217,217,217);
        border-radius: 4px;
        min-height: 36px;
    }
    /*名片里员工名字和职位格式*/
    .col_font{line-height: 35px;margin-left: 7px}
    .right_detail{border-bottom: 1px solid rgb(217,217,217); margin-right: 10px}
    /*下拉菜单样式*/
    .el-dropdown-link {
        cursor: pointer;
    }
    .el-icon-arrow-down {
        font-size: 12px;
    }
    /*右边行动详情的大样式*/
    .col_detail{margin-right: 25px;margin-left: 10px}
    .col_detail_con{height: 120px;}
    .col_detail_time{height:20px;text-align: right}
    .col_detail_set{height:40px;}
</style>